<template>
	<div class="result">
		<div class="close" @click="goClose"><i class="el-icon-circle-close"></i></div>



		<!-- v-if="Object.keys(data).length > 0" <div class="title"> 请查收您的专属报告 </div>
					<div class="line"> </div> -->
		<div class="content" style="margin: 15px auto 10px;">
			<div class="text_content">
				<div class="first">
					<div class="" style="display: flex;align-items: center;">
						<div class="left">
							<img :src="tou" class="avatar">
						</div>

						<div class="middle">
							<div class="right_first_line">
								<!-- 名称 -->
								<div class="name">
									{{ data.name }}
								</div>
								<!-- 教育 -->
								<!-- <div class="education">
										教育年限：{{ data.eduTotal }}年
									</div> -->
							</div>
						</div>
					</div>

					<div class="right">
						<!--  -->
						<div class="right_two_line">
							<div class="top">
								<div class="education">
									|&nbsp;&nbsp;&nbsp;{{ data.gender }}
								</div>
								<div class="education">
									|&nbsp;&nbsp;&nbsp;{{ data.age }}岁
								</div>
							</div>

							<div class="education">
								{{ data.reportDate }}
							</div>
						</div>
					</div>

				</div>

				<!-- <div class="test_number" style="margin-bottom:0px;">
							<div class="education"> 编号：{{ data.reportNo }} </div>
							<div class="education">
								主试人：{{ data.doctorName }}
							</div>
						</div> -->
			</div>
		</div>
		<!-- <div v-show="showSuggest" class="content" style="margin: 20px auto"> -->
		<!-- 					<div style="text-align: center;"><span style="font-size: 30px;">是否愿意把本小程序推荐给朋友 ？</span></div>
				<div style="text-align: center;">
					<div style="margin: 20px auto;margin-left: -20px;display: inline-block;"><button
							class="buttonClass"
							style="height: 50px; width: 230px;color: #004751;background-color: #66ffb5;font-size: 25px;font-weight: bold;"
							@click="showInfo(true)">是</button>
					</div>
					<div style="margin: 20px auto; margin-left: 30px; display: inline-block;"><button
							class="buttonClass"
							style="height: 50px; width: 230px; color: #66ffb5;background-color: #004751;font-size: 25px;font-weight: bold;"
							@click="showInfo(false)">否</button></div>
				</div> -->
		<!-- <div v-show="showSuggest" class="info-center">
					<span>\n</span>
					<div style="text-align: center;"><span style="font-size: 37px;">是否愿意把本小程序推荐给朋友 ？</span></div>
					<div style="text-align: center;">
						<div style="margin: 20px auto;display: inline-block;"><button class="buttonClass"
								style="height: 60px; width: 240px;color: #004751;background-color: #66ffb5;font-size: 29px;font-weight: bold;"
								@click="showInfo(true)">是</button>
						</div>
						<div style="margin: 20px auto;display: inline-block;margin-left: 20px;"><button
								class="buttonClass"
								style="height: 60px; width: 240px; color: #66ffb5;background-color: #004751;font-size: 29px;font-weight: bold;"
								@click="showInfo(false)">否</button></div>
					</div>
				</div> -->
		<div class="content">
			<div class="text_content">

				<div class="" style="display: flex;align-items: center;justify-content: space-between;">
					<div class="header_title">
						<img src="../../../img2/first2.png" alt="" style="" />
						<span style="color: #5978B5;font-size: 22px;" class="text">总体评价</span>
					</div>
					<div>
						<div class="status" style="color: #54C300" v-if="data.assessResult == 1">
							脑功能正常
						</div>
						<div class="status" style="color: #DEBC00" v-else-if="data.assessResult == 2">
							脑功能下降
						</div>
						<div class="status" style="color:#DE0000;" v-else> 脑功能损伤 </div>
					</div>
				</div>
				<!-- <u-line dashed></u-line> -->
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 8px"
					v-if="data.assessResult == 1 && data.detailContents[0].result == '正常'">
					<img src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/normal.png"
						mode="widthFix" style="width: 300px;margin-bottom: 15px;">
					<span>结果解释：您本次测评结果显示为脑功能正常，说明您尚不存在患有认知障碍的风险。</span>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 8px"
					v-else-if="data.assessResult == 1 && data.detailContents[0].result == '异常'">
					<img src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/normal.png"
						mode="widthFix" style="width: 300px;margin-bottom: 15px;">
					<span>结果解释：您本次测评结果显示为脑功能功能基本正常，但存在主观认知下降。</span>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 8px" v-else-if="data.assessResult == 2">
					<img src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/descend.png"
						mode="widthFix" style="width: 300px;margin-bottom: 15px;">
					<span>结果解释：您本次测评结果显示为脑功能下降，说明您存在患有认知障碍的风险。</span>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 8px" v-else>
					<img src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/harm.png" mode="widthFix"
						style="width: 300px;margin-bottom: 15px;">
					<span>结果解释：您本次测评结果显示为脑功能损伤，说明您存在患有认知障碍的风险。</span>
				</div>
			</div>
		</div>

		<div class="content">
			<div class="text_content">

				<div class="" style="display: flex;align-items: center;justify-content: space-between;">
					<div class="header_title">
						<img src="../../../img2/four2.png" alt="" style="" />
						<span style="color: #5978B5;font-size: 22px;" class="text">潜在风险</span>
					</div>
					<div>
						<div class="status" style="color: #54C300"
							v-if="96 <= data.brainHealthIndex && data.brainHealthIndex < 101">
							暂无
						</div>
						<div class="status" style="color: #A3C300"
							v-else-if="86 <= data.brainHealthIndex && data.brainHealthIndex < 96">
							较低
						</div>
						<div class="status" style="color: #DEBC00"
							v-else-if="61 <= data.brainHealthIndex && data.brainHealthIndex < 86">
							中
						</div>
						<div class="status" style="color: #DE7200"
							v-else-if="21 <= data.brainHealthIndex && data.brainHealthIndex < 61">
							较高
						</div>
						<div class="status" style="color: #DE0000;" v-else> 高 </div>
					</div>
				</div>

				<!-- <u-line dashed></u-line> -->
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 25px"
					v-if="96 <= data.brainHealthIndex && data.brainHealthIndex < 101">

					<img style="width: 278px;margin-bottom: 25px;"
						src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/oneStar.png"
						mode="widthFix">
					<div><span>您的脑健康状态非常好，需要注意保持长期观察，建议每隔30天进行脑健康复查，并通过训练保持状态</span></div>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 25px"
					v-else-if="86 <= data.brainHealthIndex && data.brainHealthIndex < 96">
					<img style="width: 278px;margin-bottom: 25px;"
						src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/twoStar.png"
						mode="widthFix">
					<div><span>您的脑健康状态良好，需要长期坚持脑部训练才能保持状态，建议通过训练可以保持状态稳定、避免记忆力、判断力、语言能力出现衰退</span></div>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 25px"
					v-else-if="61 <= data.brainHealthIndex && data.brainHealthIndex < 86">
					<img style="width: 278px;margin-bottom: 25px;"
						src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/threeStar.png"
						mode="widthFix">
					<div>
						<span>您的脑健康状态属于中等水平，长期的大脑健康训练对您是有必要的，您可能会出现记忆减退，判断能力下降、语言能力受损等情况，建议通过训练恢复您的记忆力、判断力等大脑基础能力</span>
					</div>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 25px"
					v-else-if="21 <= data.brainHealthIndex && data.brainHealthIndex < 61">
					<img style="width: 278px;margin-bottom: 25px;"
						src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/fourStar.png"
						mode="widthFix">
					<div><span
							style="color: #DE7200;">您的脑健康状态持续下降，如果不及时进行康复训练，将会出现记忆严重受损、语言能力、视觉能力下降等，建议通过训练来改善您的脑健康状态</span>
					</div>
				</div>
				<div class="zhushi risk" style="margin-bottom: 20px; margin-top: 25px" v-else>
					<img style="width: 278px;margin-bottom: 25px;"
						src="https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/fiveStar.png"
						mode="widthFix">
					<div><span style="color: #DE0000;">您的脑健康状态已处于严重退化阶段，如果不及时进行康复训练，会逐渐丧失语言和活动能力，请您及时到医院就诊，遵照医嘱进行治疗</span>
					</div>
				</div>
			</div>
		</div>

		<div class="content">
			<div class="text_content">
				<!-- <u-line dashed></u-line> -->
				<!-- <u-line dashed></u-line> -->
				<div class="" style="display: flex;align-items: center;justify-content: space-between;">
					<div class="header_title">
						<img src="../../../img2/secend2.png" alt="" style="" />
						<span style="color: #5978B5;font-size: 22px;" class="text">脑健康指数</span>
					</div>
					<div class="source">
						<span class="source_number" :style="{ color: scoreColor(data.score) }">{{ data.score
						}}</span>
						<span class="fen" :style="{ color: scoreColor(data.score) }">分</span>
					</div>
				</div>
				<!-- 进度条外层 -->
				<div class="progress">
					<!-- <u-line-progress :percentage="data.score" :showText="false">
							</u-line-progress> -->
					<el-progress :percentage="data.score" :showText="false" :color="scoreColor(data.score)"></el-progress>
					<!-- <img src="./kedu.png" alt=""
						style="width: 100%;height: 14px;margin: auto;position: relative;top: -40px;right: 0px;background-color: black;"> -->
					<!-- <div class="shuzi" style="">
						<div class=""> 0 </div>
						<div class=""> 10 </div>
						<div class=""> 20 </div>
						<div class=""> 30 </div>
						<div class=""> 40 </div>
						<div class=""> 50 </div>
						<div class=""> 60 </div>
						<div class=""> 70 </div>
						<div class=""> 80 </div>
						<div class=""> 90 </div>
						<div class=""> 100 </div>
					</div> -->
				</div>
				<div class="zhushi" style="padding-bottom: 20px; font-size: 17px;">
					<!-- padding-top: 35px; -->
					脑健康指数越高，表明您的脑健康状况越好
				</div>
			</div>
		</div>


		<!-- <div class="content" style="margin-bottom: 30px;text-align: center;">
					<img  src="../../../static/index/code.jpg"
						mode="widthFix">
				</div> -->
		<div>
			<div class="content" v-if="0 <= data.brainHealthIndex && data.brainHealthIndex < 86">
				<div class="remi" style="text-align: center;">
					<img id="box" @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/裂变筛查报告（认知下降）1.png" mode="widthFix">
					<img src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营2.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营3.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营4.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营5.png" mode="widthFix">
				</div>
			</div>
			<div class="content" v-else>
				<div class="remi" style="text-align: center;">
					<img id="box" @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营1.png" mode="widthFix">
					<img src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营2.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营3.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营4.png" mode="widthFix">
					<img @touchstart="onTouchStart" @touchend="onTouchEnd"
						src="https://anxd2.oss-cn-shanghai.aliyuncs.com/redPacket/img/筛查报告-训练营5.png" mode="widthFix">
				</div>
			</div>
		</div>

		<div class="content" style="margin-top: 15px;">
			<div class="text_content" style="padding-bottom: 15px;">
				<!-- <u-line dashed></u-line> -->
				<!-- <u-line dashed></u-line> -->
				<div class="header_title">
					<img src="../../../img2/five2.png" alt="" style="" />
					<span style="color: #5978B5;font-size: 22px;" class="text">脑健康指导建议</span>
				</div>
				<div class="zhushi " style="font-size: ;">
					<!-- <p v-html="
								data.adviceContents[0] ? data.adviceContents[0].content : ''
							"></p> -->
					<p v-html="data.adviceContents[0].content"></p>
				</div>
				<div class="zhushi_hui"
					style="margin-top: 20px;color: #a1b0b3;font-size: 10px;height: 33px;line-height: 18px;">
					<!-- <u-parse :content="data.noticeText"></u-parse> -->
				</div>

				<!-- 	<div class="" style="margin-top: 60px">
									<u-line dashed></u-line>
								</div> -->

				<!-- 	<div class="header_title">
									<img src="/static/img/five.png" alt="" style="" />
									<span style="" class="text">领取电子报告</span>
								</div>
								<div class="bottom">
									<div class="zhushi text">
										<div class="">
											关注公众号获取
											<br />
											详细的筛查报告及专业的健康建议
										</div>
									</div>
									<div class="imgage">
										<img src="/static/personal/ainao.jpg" alt="" style="width: 100%; height: 100%" />
									</div>
								</div> -->
			</div>
		</div>

		<!-- <div class="content" >
					<img  src="../../../static/index/code.png" mode="widthFix">
					</div> -->
		<!-- </div> -->
		<!-- <div class="helthSuggest">
				<div class="helthSuggest_left">
					<div class="thelthSuggest_left_text">
						点击查看健康建议
					</div>
					<div class="helthSuggest_left_btn" @click="receiveSuggest">
						立即查看
					</div>
				</div>
				<div class="helthSuggest_right">
					<img src="./rightimg.png" alt="" style="height: 100%;width: 100%;">
				</div>

			</div> -->
		<!-- <div class="fixed_bottom_box">
				<div class="bottom_first">
					<div class="left">
						<img src="./leftjian.png" alt="">
					</div>
					<div class="fixed_bottom_box_title">
						分享测评给身边的朋友
						共同预防脑认知疾病
					</div>
					<div class="right">
						<img src="./rightjian.png" alt="">
					</div>
				</div>
				<div class="btns">
					<button open-type="share">
						<div class="btns_left">
							<u-icon name="weixin-fill" size="28"></u-icon>
							微信好友
						</div>
					</button>
					<div class="btns_right" @click="genraterImage"> 生成图片转发 </div>
				</div>
			</div> -->

		<div class="bott">
			<img class="bottone" @click="backTop" src="../../../../assets/images/report/筛查报告-加训练营.png" alt="">
			<img @click="share" src="../../../../assets/images/report/筛查报告-分享.png" alt="">
		</div>

		<div @click="falseclick" v-if="isshow" class="bgisshow">
			<img style="width: 100%; height: 193px; position: fixed; top: 10px; " src="@/assets/images/分享提示页.png" alt="">
		</div>

	</div>
</template>
<script>
import {
	mapState
} from "vuex";
import { getReport, info, addburyingpoint, getShareData, getredpacket, addpacketstep, shareNum } from '@/api/http.js'
// import res from "./res.json";
// import {
// 	getReport,
// 	getCamplog,
// 	updateUserInfo
// } from '@/api/api.js'
import axios from "axios";
import {
	getUrl
} from "@/config.js";
import wx from "weixin-js-sdk";
export default {
	data() {
		return {
			isshow: false,
			data: {},
			patientId: '',
			token2: '',
			showSuggest: true,
			hadSuggest: false,
			color: 'color:green',
			sex: '',
			appId: 'wx89289c3a3da01e68', //微信公众号唯一标识，在微信公众号后台获取
			title: '每年一次脑健康筛查！',  //分享内容的标题
			desc: '做脑健康筛查也能领红包了，快来看看吧~', // 分享内容的简短描述
			link: 'https://www.ainaoxingdong.com/brainshare/index.html',
			imgUrl: 'https://www.ainaoxingdong.com/api/an-media/images/share.png', //必须是绝对路径,
			t: '',
			n: '',
			s: '',
			timer: null,
			addEnterpriseWechatFlag: '',//添加企业微信标识
			Num: ''
		};
	},
	computed: {
		// ...mapState({
		// 		token: (state) => state.token,
		// avatar: (state) => state.userInfo.avatarUrl,
		// 		nickName: (state) => state.userInfo.nickName,
		// }),
		tou() {
			var sexInfo = "";
			if (this.sex == 0) {
				sexInfo = "https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/boy.jpg"
			}
			if (this.sex == 1) {
				sexInfo = "https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/girl.jpg"
			}
			if (this.sex == null) {
				sexInfo = "https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/head.jpg"
			}
			return sexInfo;
			// return 'sex = 1' ? "https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/girl.jpg" :
			// 	"https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/boy.jpg";
			// return "https://www.ainaoxingdong.com/api/an-media/images/an/static/personal/girl.jpg"
		},
	},
	created() {

		// console.log('+++reeeer+++++', location.href.indexOf("#reloaded"));
		// if (location.href.indexOf("#reloaded") == -1) {
		// 	location.href = location.href + "#reloaded";
		// 	location.reload();
		// }
		var u = navigator.userAgent;
		var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
		var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
		// alert('是否是Android：'+isAndroid);
		// alert('是否是iOS：'+isiOS);
		// console.log('+++reeeer+++++', location.href.indexOf("#reloaded"));
		if (isAndroid) {
			if (location.href.indexOf("#reloaded") == -1) {
				location.href = location.href + "#reloaded";
				location.reload();
			}
		} else {
			console.log('苹果手机');
		}
		// 初始化调接口
		// this.getKeyParams();
		shareNum().then(res => {
			this.Num = res.data
			console.log(res)
		})
	},
	methods: {
		// longtap(){
		// 	console.log('长按保存图片');
		// 	let token = uni.getStorageSync('token')
		// 	console.log('token',token)

		// },
		// longtap() {
		// 	getCamplog().then(res => {
		// 		console.log('res,,', res)
		// 		const {
		// 			data
		// 		} = res
		// 		this.data = data.data || {}
		// 		// this.data.assessResult = 2
		// 		// this.data.detailContents[0].result = '异常'
		// 		// this.data = {}
		// 		console.log('data,', data)
		// 	})
		// },
		goClose() {
			let url = encodeURIComponent('activity')
			addpacketstep(url).then(res => {
				console.log(res)
				this.$router.push('/activity')
			})

		},
		onTouchStart() {
			this.timer = setTimeout(() => {
				// 长按事件开始后要执行的代码
				console.log("长按事件开始");
				if (this.addEnterpriseWechatFlag == '0') {
					this.$router.push('/Jointrainingcamp')
				} else {
					console.log('已领取');
				}
			}, 1500); // 设置长按事件的延时时间
		},
		onTouchEnd() {
			clearTimeout(this.timer); // 清除计时器，避免误触发长按事件
			// 长按事件结束后要执行的代码
			console.log("长按事件结束");
		},

		getKeyParams() {
			getShareData({ url: sessionStorage.getItem('scanUrl') }).then((result) => {
				console.log('result', result);

				this.t = result.data.timestamp
				this.n = result.data.nonceStr
				this.s = result.data.signature
				//拿到三个参数之后，调用wxConfig方法进行权限验证
				this.shareMes()
				console.log('@@@@@', this.t, this.n, this.s);
			});
		},
		shareMes() {
			wx.config({
				// 配置参数
				debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				appId: this.appId, // 必填，公众号的唯一标识
				timestamp: this.t, // 必填，生成签名的时间戳
				nonceStr: this.n, // 必填，生成签名的随机串
				signature: this.s, // 必填，签名
				jsApiList: [
					'checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'updateAppMessageShareData', 'updateTimelineShareData'
				]
			});
			wx.checkJsApi({
				jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'updateAppMessageShareData', 'updateTimelineShareData'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
				success: function (res) {
					// 以键值对的形式返回，可用的api值true，不可用为false
					// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
					console.log(res, 'checkJsApi')
				}
			});
			this.wxShare();
			console.log('hihihi');
		},
		wxShare() {
			const that = this
			wx.ready(() => {
				wx.updateAppMessageShareData({
					title: this.title, // 分享标题
					desc: this.desc,// 分享描述
					link: this.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: this.imgUrl, // 分享图标
					success: function () {
						// 用户确认分享后执行的回调函数
					}
				});
				wx.updateTimelineShareData({
					title: this.title, // 分享标题
					desc: this.desc, // 分享描述
					link: this.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					imgUrl: this.imgUrl, // 分享图标
					success: function () {
						// 用户确认分享后执行的回调函数
					}
				});
			});
			wx.error(function (res) {
				console.log('生成微信签名失败了');
				// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
			})
		},
		backTop() {
			//box表示需要定位到的div
			const scrollTop = document.getElementById("box");
			scrollTop.scrollIntoView({ block: "center", inline: "center" });
		},
		share() {
			let obj = { buriedPointName: '详情页分享', section: '6', module: '1', function: '2', redirectPage: '拉起分享浮窗', orgNo: '' }
			addburyingpoint(obj).then(res => {

				console.log(res)
			})
			this.isshow = true

			setTimeout(() => {
				if (this.Num >= 5) {
					this.$router.push({
						path: "/completeactivity",
						query: { id: 1 }
					})
				} else {
					this.$router.push({
						path: '/successfullyshared',
						query: { id: 1 }
					})
				}
			}, 3000);
		},
		falseclick() {
			this.isshow = false
		},
		getData() {
			var baseUrl = getUrl();
			var phone = ''
			var token = localStorage.getItem('token')
			info({
				phone: this.phoneInfo,
				isSuggest: 3
			}).then(res => {
				console.log(res)
				const userInfo = res.rows[0];
				console.log(userInfo);
				this.sex = userInfo.sex
			})
		},
		goNext() {
			this.$router.push('/message')
		},
		scoreColor(score) {
			const colorList = ['#DE0000', '#DE7200', '#DEBC00', '#A3C300', '#54C300', 'red'] // 颜色数组
			if (0 <= score && score < 21) {
				return '#DE0000'
			} else if (21 <= score && score < 61) {
				return '#DE7200'
			} else if (61 <= score && score < 86) {
				return '#DEBC00'
			} else if (86 <= score && score < 96) {
				return '#A3C300'
			} else if (96 <= score && score < 101) {
				return '#54C300'
			}
		},
		scrollInfo() {
			if (!this.hadSuggest) {
				this.showSuggest = true;
			}
		},
		showInfo(param) {
			var isSuggest = 0;
			if (param == true) {
				this.showSuggest = false;
				this.hadSuggest = true;
				isSuggest = 1;

			} else {
				this.showSuggest = false;
				this.hadSuggest = true;
				isSuggest = 0;
			}
			// updateUserInfo({
			// 	isSuggest: isSuggest,
			// }).then(res => {
			// 	wx.showToast({
			// 		title: '谢谢您的建议，我们会持续优化我们的筛查程序！',
			// 		icon: 'none',
			// 		duration: 2000
			// 	});
			// })
		},
		// receiveSuggest() {
		// 	uni.navigateTo({
		// 		url: `/pages/middleScreening/healthAdvice/healthAdvice`,
		// 	});
		// },
		// genraterImage() {
		// 	// 跳转到webdiv 加载图片生成网页
		// 	const url = `https://www.ainaoxingdong.com/html_img/index.html#/?query=${JSON.stringify({
		// 		token: this.token,
		// 		avatar: this.avatar,
		// 		type: '0',
		// 	})}`
		// 	// const url = `http://localhost:8080/#/?query=${JSON.stringify({
		// 	// 	token:this.token,
		// 	// 	avatar:this.avatar,
		// 	// 	type:'0',
		// 	// })}`
		// 	console.log("生成图片连接" + url);
		// 	uni.navigateTo({
		// 		url: `/pages/middleScreening/webdiv/webdiv?url=${encodeURIComponent(url)}`,
		// 	});
		// },
		report(params) {
			// 
			var baseUrl = getUrl();
			var token = localStorage.getItem("token");
			console.log('token', token, params.js_patientId, 'params.js_patientId ', 'params.js_token', params.js_token)

			var reportUrl = baseUrl + "/an/wechat_app/wechat_user/report?token=" + token;
			if (params.patientId != "" && params.token != "") {
				reportUrl = reportUrl + "&js_patientId=" + params.js_patientId + "&js_token=" + params.js_token;
			}
			// if (reportUrl) {

			getReport(reportUrl).then(res => {
				
				console.log(params,'=======================')
				if (res.code == 800) {
					setTimeout(() => {
						this.report(params)
					}, 1000)
				} else {

					console.log(res, res.data.data.age, '=========================')
					const {
						data
					} = res
					this.data = data.data || {}
					console.log('data,', res.data)

					// const {
					// 	data
					// } = res
					// this.data = data.data || {}
					// debugger
				}
			})
			// }

			// axios.get(reportUrl).then((res) => {
			// 	const {
			// 		data
			// 	} = res
			// 	this.data = data.data || {}
			// 	console.log('data,', data)
			// });
		},

	},

	mounted() {
		// 初始化调接口
		this.getKeyParams();
		var query = this.$route.query;
		var param = {};
		param.js_patientId = "";
		param.js_token = "";
		if (query.patientId != undefined || query.patientId != null) {
			param.js_patientId = query.patientId;
		}
		if (query.token != undefined || query.token != null) {
			param.js_token = query.token;
		}
		this.showSuggest = false;
		this.report(param);
		// 
		console.log('hihihi');

		this.getData()

		getredpacket().then(res => {
			console.log('===res===', res);
			this.addEnterpriseWechatFlag = res.data.addEnterpriseWechatFlag
		})
		let url = encodeURIComponent('result')
		addpacketstep(url).then(res => {
			console.log(res)
		})

	},

};
</script>


<style lang="scss" scoped>
.info-center {
	box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.05);
	border-radius: 10px;
	position: fixed;
	z-index: 999;
	background-color: #D8FEEE;
	// display: flex;
	// align-items: center;
	// justify-content: center;
	border-radius: 10px;
	width: 80%;
	height: 110px;
	margin-left: 10%;
	margin-right: 10%;
}

.buttonClass {
	display: flex;
	justify-content: center;
	align-items: center;
}

button::after {
	border: none;
}

button {
	background-color: #fff;
	margin: 0;
	padding: 0;
}

page {
	// padding-bottom: 264px;
}

.helthSuggest {
	width: 335px;
	height: 111px;
	background: #66FFB5;
	box-shadow: 0px -4px 8px 0px rgba(0, 0, 0, 0.05);
	border-radius: 10px;
	margin: auto;
	margin-top: 10px;
	box-sizing: border-box;
	padding: 20px 15px;
	display: flex;

	.helthSuggest_left {
		flex: 1;

		.thelthSuggest_left_text {
			// width: 256px;
			height: 22px;
			font-size: 8px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 550;
			color: #003941;
			line-height: 22px;

		}

		.helthSuggest_left_btn {
			width: 116px;
			height: 36px;
			background: #004751;
			box-shadow: 4px 6px 18px 0px rgba(31, 90, 102, 0.1);
			border-radius: 10px;
			text-align: center;
			font-size: 16px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 550;
			color: #66FFB5;
			line-height: 36px;
			margin-top: 13px;
		}
	}

	.helthSuggest_right {
		width: 110px;
		height: 63px;
	}
}

.fixed_bottom_box {
	width: 100vw;
	height: 132px;

	.bottom_first {
		width: 100%;
		display: flex;
		margin-top: 30px;

		.left {
			flex: 1;
			text-align: right;
			display: flex;
			align-items: center;
			justify-content: flex-end;

			img {
				width: 39px;
				height: 24px;
			}
		}

		.right {
			flex: 1;
			text-align: left;
			display: flex;
			align-items: center;

			img {
				width: 39px;
				height: 24px;
			}
		}

		.fixed_bottom_box_title {
			width: 160px;
			// height: 48px;
			line-height: 24px;
			// padding-top: 40px;
			text-align: center;
			font-size: 16px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 550;
			color: #003941;
			line-height: 24px;
		}
	}


	.btns {
		margin-top: 20px;
		display: flex;
		justify-content: space-around;
	}

	.btns_left {
		width: 75px;
		height: 24px;
		background: #66ffb5;
		box-shadow: 4px 6px 18px 0px rgba(31, 90, 102, 0.1);
		border-radius: 5px;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #003941;
	}

	.btns_right {
		width: 75px;
		height: 24px;
		background: #004751;
		box-shadow: 4px 6px 18px 0px rgba(31, 90, 102, 0.1);
		border-radius: 5px;
		font-size: 8px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #66ffb5;
		line-height: 24px;
		text-align: center;
	}
}

.zhushi_hui {
	width: 153px;
	height: 17px;
	font-size: 5px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	color: #a1b0b3;
	line-height: 7px;
	text-align: center;
}

.header_title {
	margin: 15px 0;

	img {
		width: 21px;
		height: 21px;
		position: relative;
		top: 5px;
	}

	.text {
		height: 24px;
		font-size: 16px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: bold;
		color: #003941;
		line-height: 24px;
		margin-left: 5px;
	}
}

.status {
	height: 24px;
	font-size: 11px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: bold;
	color: #d96c36;
	line-height: 24px;
}

.zhushi {
	font-size: 17px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	// color: #336c74;
	// color: #B5C3E0;
	width: 300px;
	height: 100%;
	color: #5978B5;
	line-height: 24px;
}

.source {
	.source_number {
		height: 24px;
		font-size: 20px;
		font-family: DINAlternate-Bold, DINAlternate;
		font-weight: bold;
		// color: #003941;
		line-height: 24px;
	}

	.fen {
		width: 25px;
		height: 17px;
		font-size: 12px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #336c74;
		line-height: 17px;
	}
}

.progress {
	margin-top: 2px;
	width: 100%;
	height: 20px;


	// border-radius: 14px;
	// background: linear-gradient(270deg, #00CC6A 0%, #F2A247 100%);
	// opacity: 0.2;
	.u-line-progress__line {
		background: linear-gradient(270deg, #1bcc00 0%, #ffc400 50%, #ff0500 100%);
		// background: linear-gradient(270deg, #00cc6a 0%, #f2a247 100%);
	}

	.u-line-progress__background {
		// background-color: #cff5e1;
	}

	.shuzi {
		display: flex;
		justify-content: space-between;
		// padding-top: 4px;


		div {
			text-align: center;
			padding: 0 11px;
			flex: 1;
			width: 11px;
			height: 11px;
			font-size: 8px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #b8c0cc;
			// line-height: 11px;
		}
	}
}

.box_1 {
	.algin {
		display: flex;
		justify-content: space-between;
		margin: 10px 0;
		width: 100%;
	}

	.heiti {
		height: 17px;
		font-size: 12px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 550;
		color: #004751;
		line-height: 17px;
	}

	.text {
		height: 17px;
		font-size: 12px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;

		line-height: 17px;
	}
}

.box_2 {
	margin-top: 15px;

	.box_title {}
}

.bottom {
	display: flex;
	align-items: center;

	.text {
		flex: 1;
	}

	.imgage {
		width: 84px;
		height: 84px;
		background-color: hotpink;
	}
}

// .scroller-content {
// 	width: 100%;
// 	height: calc(100vh - var(--window-top)); //calc()是动态计算函数
// 	//100vh:把屏幕高度分成100等份
// 	//--window-top屏幕顶部栏目部分
// }

.result {
	// background: linear-gradient(180deg, #00cc6a 0%, #d8feeb 30%);
	// background-color: #EBF3FF;
	width: 100%;
	// height: 100%;
	position: relative;
	overflow-y: scroll;
	padding-bottom: 60px;

	.title {
		width: 90px;
		height: 15px;
		font-size: 10px;
		font-family: FZLTDHJW--GB1-0, FZLTDHJW--GB1;
		font-weight: normal;
		color: #ffffff;
		line-height: 15px;
		padding-left: 35px;
		padding-top: 20px;
	}

	.line {
		width: 345px;
		height: 10px;
		background: #336c74;
		border-radius: 10px;
		margin: auto;
		margin-top: 10px;
		z-index: 1;
		position: relative;
		opacity: 0.5;
		bottom: -5px;
	}

	.content {
		width: 335px;
		background: #ffffff;
		box-shadow: 0px 6px 16px 0px rgba(75, 126, 139, 0.1);
		margin: auto;
		z-index: 44;
		position: relative;
		opacity: 1;
		border-radius: 10px 10px 10px 10px;

		.text_content {
			padding: 2px 15px;
			margin-bottom: 15px;
			display: flex;
			flex-direction: column;

			.education {
				height: 17px;
				font-size: 12px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				// color: #336c74;
				color: #B5C3E0;
				line-height: 17px;
			}

			.first {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 92px;

				.left {
					width: 61px;
					height: 61px;
					border-radius: 50%;
					border: 1px solid #E7EFFF;

					img {
						width: 100%;
						height: 100%;
						border-radius: 50%;
					}
				}

				.middle {
					margin-left: 17px;

					.right_first_line {
						// display: flex;
						// width: 100%;
						// justify-content: space-between;

						.name {
							height: 24px;
							font-size: 16px;
							font-family: PingFangSC-Medium, PingFang SC;
							font-weight: 900;
							// color: #003941;
							color: rgba(85, 153, 255, 1);
							// line-height: 48px;
						}

						.education {
							line-height: 24px;
						}
					}
				}

				.right {
					// flex: 1;
					padding-left: 15px;
					height: 45px;
					display: flex;
					justify-content: space-between;


					.right_two_line {
						display: flex;
						flex-direction: column;
						width: 100%;
						align-items: flex-end;
						justify-content: space-between;

						.top {
							width: 75px;
							display: flex;
							align-items: center;
							justify-content: space-between;
						}
					}
				}
			}

			.test_number {
				display: flex;
				width: 100%;
				justify-content: space-between;
				margin-top: 20px;
				margin-bottom: 15px;
			}
		}
	}
}

.result222 {
	background: linear-gradient(180deg, #00cc6a 0%, #d8feeb 100%);
	width: 100%;
	position: relative;
	position: absolute;
	top: -99999px;
	left: -9999px;
	padding-top: 20px;

	.content222 {
		width: 335px;
		// height: 3288px;
		background: #ffffff;
		box-shadow: 0px 6px 16px 0px rgba(75, 126, 139, 0.1);
		margin: auto;
		// padding-top: -5px;
		z-index: 44;
		position: relative;
		opacity: 1;
		border-radius: 5px 5px 0px 0px;
		position: relative;
	}
}

.risk {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.el-progress {
	height: 15px !important;
	// margin-bottom: 10px !important;
}

.el-progress-bar__outer {
	height: 13px !important;
}

.remi {
	width: 100%;
	height: 100%;
}

.remi img {
	display: block;
	width: 100%;
	height: 100%;
}

.bott {
	width: 100%;
	height: 110px;
	position: fixed;
	bottom: 0;
	z-index: 1111111;

	img {
		width: 100%;
		display: block;
	}
}

.bgisshow {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 779999999999;
	background: #000000bf;
	top: 0;
	left: 0;
}

.close {
	position: fixed;
	top: 0px;
	right: 10px;
	font-size: 36px;
	width: 45px;
	height: 45px;
	// color: #B5C3E0;
	color: #66A1F7;
	text-align: center;
	line-height: 45px;
	z-index: 55;
}
</style>
